<%--
  Created by IntelliJ IDEA.
  User: leman
  Date: 2017/7/7
  Time: 12:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<style>
    .layui-laypage li{
        display: inline-block;
    }
    #on {
        height: 30px;
        line-height: 30px;
        border: 1px solid #e2e2e2;
        border-radius: 2px;
        vertical-align: top;
        background-color: #fff;
        box-sizing: border-box!important;
        width: 50px;
        margin: 0 5px;
        text-align: center;
    }
    .active{
        background: #009688;
        height: 29px;
    }
    .active a{
        color:#fff;
        border:1px solid #009688;
    }
    .layui-laypage a{
        background: border-box;
    }
    #seaBox{
        margin: 15px 0px 6px;
        padding: 10px;
        background-color: rgb(242, 242, 242);
    }
    .layui-body {
        overflow: auto;
    }
</style>


<button class="layui-btn layui-btn-small layui-btn-normal" ng-click="seaToggle()">查询账单</button>
<button class="layui-btn layui-btn-small" ng-click="newBill()">新建账单</button>
<button class="layui-btn layui-btn-small" ng-click="refreshBtn()">确认账单</button>
<button class="layui-btn layui-btn-small layui-btn-danger" ng-click="delBtn()">删除账单</button>

<form class="layui-form" action=""  id="seaBox" ng-hide="mySea">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">客户</label>
            <div class="layui-input-inline">
                <select name="quiz">
                    <option value="0">请选择客户</option>
                    <option value="1">特斯拉</option>
                    <option value="2">团车网</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">账单编号</label>
            <div class="layui-input-inline">
                <input type="text" name="number" lay-verify="required|number" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">账单状态</label>
            <div class="layui-input-inline">
                <select name="modules" lay-verify="required" lay-search="">
                    <option value="0">请选择账单状态</option>
                    <option value="1">未对账</option>
                    <option value="2">已确认</option>
                    <option value="3">已收款</option>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">范围选择</label>
        <div class="layui-input-inline">
            <input class="layui-input" placeholder="开始日" id="LAY_demorange_s">
        </div>
        <div class="layui-input-inline">
            <input class="layui-input" placeholder="截止日" id="LAY_demorange_e">
        </div>
    </div>
    <div class="layui-input-inline" style="text-align: center;width: 100%;">
        <button class="layui-btn layui-btn-normal" ng-click="resetBtn()">重置</button>
        <button class="layui-btn" ng-click="seaBtn()">查询</button>
    </div>
</form>
<table class="layui-table" style="width: 1300px;">
    <tr>
        <th><input type="checkbox" ng-model="selectAll" ng-click="all(selectAll)"></th>
        <th>客户订单号</th>
        <th>服务订单号</th>
        <th>客户</th>
        <th>下单日期</th>
        <th>起运地</th>
        <th>目的地</th>
        <th>品牌</th>
        <th>车系</th>
        <th>车型</th>
        <th>车架号</th>
        <th>数量</th>
        <th>订单金额</th>
        <th>状态</th>
        <th>交车日期</th>
    </tr>
    <tr ng-repeat="x in names">
        <td><input type="checkbox" ng-checked="selectAll" ng-model="person.state" ng-click="select(selected)" name="id_name" value="{{ x.a }}"></td>
        <td>{{ x.a }}</td>
        <td>{{ x.b }}</td>
        <td>{{ x.c }}</td>
        <td>{{ x.d }}</td>
        <td>{{ x.e }}</td>
        <td>{{ x.f }}</td>
        <td>{{ x.z }}</td>
        <td>{{ x.g }}</td>
        <td>{{ x.k }}</td>
        <td>{{ x.l }}</td>
        <td>{{ x.m }}</td>
        <td>{{ x.n }}</td>
        <td>{{ x.o }}</td>
        <td>{{ x.p }}</td>
    </tr>
</table>
<div>
    <ul class="layui-box layui-laypage layui-laypage-default" style="margin: 0px;" >
        <li ng-class="{true:'disabled'}[p_current==1]">
            <a class="laypage_first" href="javascript:void(0);" ng-click="p_index()">首页</a>
        </li>
        <!--这块是显示多少页的  你看看 page in pages 是一个循环 pages哪里来的？ 看看js-->
        <li ng-repeat="page in pages" ng-class="{true:'active'}[p_current==page]">
            <a class="layui-laypage-curr"  href="javascript:void(0);" ng-click="load_page(page)">{{ page }}</a>
        </li>
        <li ng-class="{true:'disabled'}[p_current==p_all_page]">
            <a class="layui-laypage-last" href="javascript:void(0);" ng-click="p_last()">尾页</a>
        </li>
    </ul>
    <span>共{{count}}条</span>
    <span style="padding-left: 10px;">到第
        <input id="on" type="text" value="{{p_current}}"/>页
        <button class="layui-btn layui-btn-small btn" ng-click="goBtn()">确定</button>
    </span>
</div>
<%--<div class="layui-form-item" style="text-align: center;margin-top: 60px;">--%>
    <%--<button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="demo2">取消</button>--%>
    <%--<button class="layui-btn" lay-submit="" lay-filter="demo2">下一步</button>--%>
<%--</div>--%>
<script>
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form()
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;
        form.render()
    });

    //时间
    layui.use('laydate', function(){
        var laydate = layui.laydate;

        var start = {
            min: laydate.now()
            ,max: '2099-06-16 23:59:59'
            ,istoday: false
            ,choose: function(datas){
                end.min = datas; //开始日选好后，重置结束日的最小日期
                end.start = datas //将结束日的初始值设定为开始日
            }
        };

        var end = {
            min: laydate.now()
            ,max: '2099-06-16 23:59:59'
            ,istoday: false
            ,choose: function(datas){
                start.max = datas; //结束日选好后，重置开始日的最大日期
            }
        };

        document.getElementById('LAY_demorange_s').onclick = function(){
            start.elem = this;
            laydate(start);
        }
        document.getElementById('LAY_demorange_e').onclick = function(){
            end.elem = this
            laydate(end);
        }
    });
</script>


